@media all and (min-width:1024px){
	.box{
		width: 1024px;
		padding: 20px;
		margin: 10px auto 0;
		background: red;
	}
	h2{
		font-size: 28px;
	}
	h2 strong{
		font-size: 14px;
		color: #5b666b;
		float: right;
		margin-right: 30px;
	}
	.list{
		margin-top: 30px;
		display: flex;
		justify-content: space-around;
	}
	.list li img{
		width: 90%;
	}
	.list li p{
		font-size: 12px;
	}
	/* 640px到1023px之间 */
	@media all and (min-width:640px) and (max-width:1023px){
		.box{
			width: 1024px;
			padding: 20px;
			margin: 10px auto 0;
			background: pink;
			display: flex;
			flex-direction: column;
		}
		h2{
			font-size: 20px;
		}
		h2 strong{
			font-size: 16px;
			color: #5b666b;
			float: right;
			margin-right: 24px;
		}
		.list{
			margin-top: 30px;
			display: flex;
			flex-wrap: wrap;
		}
		.list li img{
			width: 90%;
		}
		.list li p{
			font-size: 14px;
		}
		/* 320px到639px之间 */
		@media all and (min-width:320px) and (max-width:639px){
			.box{
				width: 320px;
				padding: 20px;
				margin: 10px auto 0;
				background: yellow;
				display: flex;
				flex-direction: column;
			}
			h2{
				font-size: 22px;
			}
			h2 strong{
				font-size: 18px;
				color: #5b666b;
				float: right;
				margin-right: 20px;
			}
			.list{
				margin-top: 30px;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
			}
			.list li img{
				width: 100%;
			}
			.list li p{
				font-size: 16px;
			}
}
